<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			#box{
				width:100px;
				height:40px;
				border:1px solid red;
			}
			#box .title{
				height:40px;
				width:100px;
				line-height: 40px;
				text-align: center;
			}
			#box .content{
				height:100px;
				width: 100px;
				border:1px solid blue;
				/*none:让一个元素隐藏*/
				display: none;
			}
			#box:hover .content{
				/*block:1.将元素转为块元素.2.让隐藏的元素(display:none)==>显示出来*/
				display: block;
			}
			
		</style>
	</head>
	<body>
		<div id="box">
			<div class="title">我是标题</div>
			<div class="content">我是内容</div>
		</div>
	</body>
</html>
